<template>
	<view class="wrap">
		<view v-if="curriculumList.length > 0">
			<view class="mitem" v-for="(item,index) in curriculumList" :key = "item.id" @click="click(item)">
				 <text class="mitem_title">{{item.curriculumName}}</text>
						 <u-icon name="arrow-right" color="#333333" size="14"></u-icon>
			</view>
			 <u-loadmore :status="loadingStatus" @loadmore="clickloadmore"></u-loadmore>
		</view>
		 
		 <u-empty v-if="curriculumList.length == 0" mode="list" marginTop="40upx"></u-empty>
		
	</view>
</template>

<script>
	import * as courseApi from '@/common/apis/course-api.js';
	export default {
		data() {
			return {
				pageNum : 1,
				loadingStatus: 'loading',
				curriculumList :[],
				courseId : '',
				courseInfo : {}
			}
		},
	
	onPullDownRefresh() {
		this.pageNum = 1;
		this.getCurriculumList();
	},
	
	onReachBottom() {
		console.log('到底了');
		this.getCurriculumList();
		this.loadingStatus = 'loading';
	},
	
	 async onLoad(op) {
			//获取学习专栏信息
			this.courseId = op.courseId;
			this.courseInfo = getApp().globalData.courseInfo;
	
      //导航栏标题修改
			uni.setNavigationBarTitle({
				title:this.courseInfo.courseName + '学习专栏',
				success(e) {
					console.log(e);
				}
			})
			
			await this.getCurriculumList();
		},
		
		methods: {
			getCurriculumList() {
				courseApi.curriculumList({
			     courseId : this.courseId,
					 pageNum : this.pageNum,
					 pageSize : 10
				}).then(res=> {
					
					if(this.pageNum == 1) {
						this.curriculumList = [];
						this.pageNum++;
						// this.loadingStatus = 'loadmore';
						this.loadingStatus = 'nomore';
					}else {
						if (!uni.$u.test.isEmpty(res)) {
							this.pageNum++;
							this.loadingStatus = 'loadmore';
						} else {
							this.loadingStatus = 'nomore';
						}
					}
					
					if (!uni.$u.test.isEmpty(res)) {
						this.curriculumList = res;
						// this.curriculumList = this.curriculumList.concat(res);
					}
				})
			},
			click(item) {
				uni.navigateTo({
					url: './chapter-detail?chapterId=' + item.id + '&chapterName=' + item.curriculumName
				})
			},
			
		  clickloadmore() {
		  	this.getCurriculumList();
		  	this.loadingStatus = 'loading';
		  },	
			
		}
	}
</script>

<style lang="scss" scoped>
.wrap {
	padding: 10upx 35upx;
}
	.mitem {
		padding: 35upx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #ffffff;
		border-radius: 16upx;
		box-shadow: 0 0 68upx 0 rgba(69,69,69,0.13); 
		margin-top: 20upx;
		&_title {
			font-size: 30upx;
			font-family: Source Han Sans CN, Source Han Sans CN-Bold;
			font-weight: bold;
			text-align: left;
			color: #333333;
		
		}
	}
</style>
